import React from "react";
import PropTypes from "prop-types"
function SubNav(props){
    const {checked,setChecked,list,scrollFlg}=props
    return (
        <div className="sub_nav" >
            <ul>
            {
                list.map(item=><li key={item.first_letter}>
                    <label onClick={()=>{!scrollFlg&&setChecked(item.first_letter)}} className={item.first_letter==checked?'on':''}>{item.first_letter}</label>
                </li>)
            }
            </ul>
        </div>
    )
}
SubNav.defaultProps={
    list:[],
    checked:'',
    scrollFlg:false,
    setChecked:()=>{}
}
SubNav.propTypes={
    list:PropTypes.array,
    checked:PropTypes.string,
    scrollFlg:PropTypes.bool,
    setChecked:PropTypes.func,
}
export default SubNav